
<!DOCTYPE html>
<html>
<head>
	<title>新增栏目</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<link rel="stylesheet" href="__ADMIN__/bootstrap/css/bootstrap.min.css" media="all">
    <link rel="stylesheet" href="__ADMIN__/adminlte/css/AdminLTE.min.css">
    <link rel="stylesheet" href="__ADMIN__/adminlte/css/font-awesome.min.css">
    <link rel="stylesheet" href="__ADMIN__/zTreeStyle/zTreeStyle.css">
    <style>
        .ztree li span{
            font-size: 14px;
        }
        .ztree li{
            line-height: 28px;
        }
        .ztree li a.curSelectedNode{
            height: 26px;
        }
    </style>
</head>
<body>
    <div class="panel-body">
      <div class="row">
        <div class="col-xs-12">
         <div class="nav-tabs-custom">
            <ul class="nav nav-tabs">
              <li class="header"><i style="cursor: pointer;" onclick="window.history.back(-1);" class="fa fa-mail-reply-all"></i>新增用户组</li>
            </ul>
             <form class="form-horizontal" enctype="multipart/form-data" method="post" action="{:url('add')}">
                 <div class="box-body">
                          <div class="form-group">
                            <label  class="col-sm-1 control-label"><span style="color:#f00;">*</span>用户组名称</label>
                            <div class="col-sm-3">
                              <input type="text" name="title" class="form-control"  placeholder="用户组名称">
                            </div>
                          </div>

                             <input  name="rules" type="hidden"  id="authId" >
                     <div class="form-group">
                         <label  class="col-sm-1 control-label">选择权限</label>
                         <div class="col-sm-3">
                             <div class="zTree">
                                 <ul id="treeDemo" class="ztree"></ul>
                             </div>
                         </div>
                     </div>
                          <div class="form-group">
                            <label  class="col-sm-1 control-label">是否禁用</label>
                            <div class="col-sm-2">
                               <select name="status" class="form-control">
                                <option value="1">否</option>
                                <option value="0">是</option>
                              </select>
                            </div>
                          </div>
                    </div>
                <div class="box-body">
                  <div class="form-group">
                      <label  class="col-sm-1 control-label"></label>
                      <div class="col-sm-2">
                          <button type="submit" class="btn btn-block btn-info">确认提交</button>
                      </div>
                  </div>
                </div>

             </form>
            <!-- /.tab-content -->
          </div>
        </div>
      </div>
    </div>
    
</body>

<!-- jQuery 2.2.3 -->
<script src="__ADMIN__/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="__ADMIN__/bootstrap/js/bootstrap.min.js"></script>
<script src="__ADMIN__/zTreeStyle/jquery.ztree.core.js"></script>
<script src="__ADMIN__/zTreeStyle/jquery.ztree.excheck.js"></script>
<SCRIPT type="text/javascript">
    var setting = {
        check: {
            enable: true
        },
        view: {
            showIcon: false,
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        callback: {
            onCheck: onCheck
        }
    };
    var zNodes;
    $.post("ztreeAjax",function (data) {
        console.log(data);
        zNodes=data;
        $.fn.zTree.init($("#treeDemo"), setting, zNodes);
    })
    function onCheck(e, treeId, treeNode) {
        var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            nodes = zTree.getCheckedNodes(true),
            v = "";
        for (var i=0, l=nodes.length; i<l; i++) {
            v += nodes[i].id + ",";
        }
        if (v.length > 0 ) v = v.substring(0, v.length-1);
        var cityObj = $("#authId");
        cityObj.attr("value", v);
    }

</SCRIPT>
</html>